<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>欢迎来到羊羊村</title>
		<style>
			.div1 {
				height: 100px;
				width: 100%;
				background-color: yellowgreen;
			}
			
			.div11 {
				font-size: 70px;
				text-align: center;
			}
			
			.div2 {
				height: 800px;
				/*background-color:red;*/margin: 0;
			}
			
			.div21 {
				height: 800px;
				width: 500px;
				background-color: red;
				float: left;
			}
			
			.div22 {
				height: 300px;
				width: 500px;
				/*background-color: yellow;*/
			}
			.div22:hover img{transform: scale(1.2);}
			
			.div23 {
				height: 500px;
				width: 500px;
				background-color: lightgoldenrodyellow;
			}
			.div23:hover img{transform: scale(1.2);}
			
			.div24 {height: 600px;
				width: 1000px;
				background-color: lightgoldenrodyellow;float: right;}
			
			.div25 {height: 300px;
				width: 600px;float: left;font-family: 楷体;color:white;
				font-size: 30px;
				
				}
			.div3{height: 500px;
				width:1000px;float: right;}
				.div3:hover img{transform: scale(1.03);}
				.div4{height: 300px;background-color: #008000;
				width: 1000px;float: left;}
				
				.div5 {height: 300px;
				width: 400px;float: left; }
				.div5:hover img{ border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;}
		</style>

		</div>

	</head>

	<body>
		<div class="div1">
			<div class="div11">Sheep Village 羊羊村</div>
		</div>
		
		
		<div class="div2">
			
			
			

			<div class="div21">
				
				
				
				
				
				
				<div class="div22">
					<img src="img/山羊.jpg" width="500px" height="300px" />
				</div>
				<div class="div23">

					<img src="img/山羊动漫" width="500px" height="500px" />
				</div>
			
			
			
			
			
			</div>
			
			
			
			
			



			<div class="div24">
				<div class="div4"><div class="div25">山羊是人类最早驯化的一种家畜。
					一般有角的是雄性山羊（这样才具有攻击性，羊爸爸才能更好保护小羊妈妈和羊宝宝），
					无角的是雌性山羊（也就是羊妈妈）。悄悄告诉你，喜羊羊与灰太狼中的小羊大多都是
					山羊哦，是不是没看出来以为是绵羊呢？
				</div>  <div class="div5"> <img src="img/喜羊羊.jpg"
		 height="300px" width="435px"/></div>  </div>
	
	
			<div class="div3">
				<img src="img/喜羊羊与美羊羊.jpg" height="500px" width="1000px" />
			
			</div>
			
			
			
			
			
			
			
			
			</div>
			
			
			
			
			
			
			
			
			
			
			
			
			</div>
		
		
		

	
		

		

	</body>

</html>